<template>
	<view>
		<view style="padding:20rpx;">
			<fui-data-tag multiple mark defaultBorderColor="#e0e0e0" :options="VipYoushiLabels"
				:value="UserYoushiLabels" @change="changeYoushiLabel"></fui-data-tag>
		</view>
		<view style="padding:30rpx">
			<view style="float:left;height:70rpx;line-height:80rpx;">其它优势：</view>
			<view style="float:left;">
				<input v-model="otherYoushi" type="text" placeholder="如果您有其他优势,请输入"
					style="height:70rpx;border-bottom:1rpx solid #e0e0e0;" />
			</view>
		</view>
		<!-- <button class="submitBtn" @click="saveYoushiLabel">保存我的优势</button> -->
		<button class="sub-btn" @click="saveYoushiLabel">保存我的优势</button>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				VipYoushiLabels: [],
				SelectYoushiLabels: [],
				UserYoushiLabels: [],
				otherYoushi: ''
			};
		},
		onLoad() {
			this.getPhoto();
			this.getVipLabel();
		},
		methods: {
			getVipLabel() {
				this.$httpost('/Labels/VipLabel', {}).then(res => {
					if (res.code == 200) {
						this.VipYoushiLabels = res.data.VipYoushiLabels
					}
				});
			},
			getPhoto() {
				this.$httpost('/UserCenter/myVipinfo', {}).then(res => {
					if (res.code == 200) {
						if (res.data.UserYoushiLabels) {
							this.UserYoushiLabels = res.data.UserYoushiLabels
							this.otherYoushi = res.data.OtherYoushi

							// console.log('this.UserYoushiLabels', this.UserYoushiLabels)
						}
					}
				});
			},
			changeYoushiLabel(e) {
				// console.log('changeYoushiLabel', e)
				this.SelectYoushiLabels = e.detail.item
				this.UserYoushiLabels = e.detail.value
			},
			saveYoushiLabel() {

				// console.log('this.UserYoushiLabels', this.SelectYoushiLabels)

				this.$httpost('/UserAction/saveYoushiLabel', {
					YoushiLabels: this.SelectYoushiLabels,
					UserYoushiLabels: this.UserYoushiLabels,
					otherYoushi: this.otherYoushi
				}).then(res => {
					if (res.code == 200) {
						uni.navigateBack()
						// if (res.data.UserYoushiLabels !== null) {
						// 	// this.UserYoushiLabels = JSON.parse(res.data.UserYoushiLabels)
						// 	uni.navigateBack()
						// }
					}
				});
			}
		}
	}
</script>

<style lang="scss">
	.submitBtn {
		background-color: $globalColor;
		color: #000;
		font-size: 28rpx;
		border: 0rpx solid $globalColor;
		width: 80vw;
		height: 60rpx;
		line-height: 60rpx;
		margin: auto;
		margin-top: 100rpx;
	}
</style>